<body>
    <h1>Eliminar cita</h1>
    <br /><br />
    <div id="mytabs">
        <ul id="tablist">
            <li id="tabs-1-tab"><a href="#tabs-1">Elimiar por Fecha</a></li>
        </ul>
        <div id="tabs-1">
            <table align="center">
                <tr>
                    <td>
                        fecha
                    </td>
                    <td>
                        <input name="fecha" id="fecha"/>
                    </td>
                </tr>
                <tr>
                    <td>
                        <p>
                            <span class="art-button-wrapper">
                                <span class="art-button-l"> </span>
                                <span class="art-button-r"> </span>
                                <a class="art-button" style="cursor: pointer;" href="javascript:eliminar()">Eliminar</a>
                            </span>
                        </p>
                    </td>
                     <td>
                    <p>
                        <span class="art-button-wrapper">
                            <span class="art-button-l"> </span>
                            <span class="art-button-r"> </span>
                            <a class="art-button" style="cursor: pointer;" href="javascript:limpiar()">Limpiar</a>
                        </span>
                    </p>
                </td>
                </tr>
            </table>
            <div id="respuesta"></div> 

        </div>

    </div>
    <script>
        
        function eliminar(){			
            console.log(">>>" + $("#fecha").get(0).value);
            //Con jquery obtengo los id de cada input que estan en mi pagina html.
            var params = {fecha: $("#fecha").get(0).value, accion:'eliminar'}			
            $("#respuesta").load("../controladores/CitaControlador.php", params, function(){	
                console.log("recibidos los datos por ajax");
            });
        }
        $("#fecha" ).datepicker({
            showOn: "button",
            buttonImage: "../images/calendar.gif",
            buttonImageOnly: true,
            changeMonth: true,
            changeYear: true
        });
        $("#mytabs").tabs();
    </script>  
</body>
